<template>
    <div class="iphone">
        <div class="iphone__box">
        <iframe class="iphone__iframe" :src="url" frameborder="0" width="345px"  height="640"  scrolling="auto"></iframe>
        </div>
    </div>
</template>

<script>
export default {
    name:"iphone",
    data(){
        return {
        }
    },
    props:{
        url:{//按钮颜色类型
            type:String,
            default:'https://funren.gitee.io/fast-ui/#/'
        },
    }
}
</script>

<style lang="css" scoped>
.iphone {
    border:1px solid #E5E8E8;
    border-radius: 20px;
    overflow: hidden;
    position:fixed;
    top:4.6rem;
    right:20px;
    z-index: 9;
    box-shadow: -5px 5px 10px rgba(239, 239, 240, 0.5);
    
}
.iphone__box {
    width:345px; 
    height:640px;
    overflow:hidden;
}
.iphone__iframe {
    border: none;
    overflow-x: hidden; 
    overflow-y: scroll;
}
</style>